<template>
  <div class="foot-wrap">
    <div class="foot clearfix">
      <section class="fl">
        <nav>
          <router-link to="/" tag="span">首页</router-link>
          <span class="line"></span>
          <span class="pos-rel">
            <span>产品</span>
            <ul class="pos-ab">
              <router-link to="/product" tag="li">教练机1.0</router-link>
              <router-link to="/saas" tag="li">SaaS服务</router-link>
            </ul>
          </span>
          <span class="line"></span>
          <span class="pos-rel">
            <span>解决方案</span>
            <ul class="pos-ab pos-ab1">
              <li>体育培训</li>
            </ul>
          </span>
          <span class="line"></span>
          <!-- <span>咨询服务</span>
          <span class="line"></span> -->
          <span class="pos-rel">
            <span>支持</span>
            <ul class="pos-ab pos-ab2">
              <li>文档</li>
              <li>建模样例</li>
            </ul>
          </span>
          <span class="line"></span>
          <span>关于我们</span>
          <span class="line"></span>
          <router-link tag="span" to="/news">新闻中心</router-link>
        </nav>
        <div class="call-us">
          <h2>联系我们</h2>
          <section class="clearfix">
            <dl class="fl tel">
              <dt>联系方式</dt>
              <dd>东莞负责人：严先生 16620826658</dd>
              <dd>北京负责人：游先生 13718182767  (微信同号)</dd>
            </dl>
            <dl class="fl addr">
              <dt>地址</dt>
              <dd>东莞办公地址：东莞松山湖高新技术产业开发区新竹路4号新竹苑17幢1单元B区6楼613室</dd>
              <dd>北京办公地址：北京市海淀区蓝靛厂南路25号牛顿办公区1011室</dd>
            </dl>
          </section>
        </div>
      </section>
      <div class="fl right">
        <img draggable="false" src="../../assets/image/wximg.png" alt="">
        <div>
          <p>扫描二维码关注</p>
          <p>“羽戈科技公众号”</p>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  
}
</script>
<style scoped>
  .foot-wrap{
    height:387px;
    padding:60px 0;
    box-sizing: border-box;
    background-color: #fbfbfb;
  }
  .foot{
    width:1200px;
    margin: 0 auto;
  }
  .foot-wrap nav{
    font-size: 0;
    margin-bottom: 100px;
  }
  nav span{
    font-size: 18px;
    color: #848383;
    cursor: pointer;
  }
  nav .line{
    width:1px;
    height:18px;
    display: inline-block;
    background-color: #898989;
    margin:0 33px; 
  }
  .pos-ab{
    font-size: 14px;
    line-height: 28px;
    color:#bdbdbd;
    position: absolute;
    width:72px;
    top:38px;
    left:-14px;
    text-align: center;
  }
  .pos-ab1{
    left:0;
  }
  .pos-ab2{
    left:-18px;
  }
  .call-us h2{
    font-size: 18px;
    color:#636363;
  }
  dl{
    width:590px;
    height:110px;
    color:#666;
  }
  dt{
    font-size: 18px;
    line-height: 45px;
    padding-left:22px;
    position: relative;
  }
  dt::after{
    display:block;
    position: absolute;
    left:0;
    top:0;
  }
  dd{
    font-size: 14px;
    line-height: 28px;
  }
  .tel{
    width:370px;
  }
  .tel dt::after{
    content: url('../../assets/image/icon2/10.png');
  }
  .addr dt::after{
    content: url('../../assets/image/icon2/11.png');
  }
  p{
    font-size: 14px;
    line-height: 24px;
    color:#999;
    text-align: center;
  }
</style>
